﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
	Products
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
	<div style="width: 250px; position: absolute; text-align: left;">
		<div>
			<div id="classFieldHolder" class="arrowlistmenu">
				<%--<h3 class="menuheader expandable" style="color: #006FA1; background-image: url('../../Content/Images/moretitle.png')));">
					CONCRETE ADMIXTURES</h3>
				<ul class="categoryitems">
					<li>
						<a href="#">Horizontal CSS Menus</a></li>
					<li>
						<a href="#">Vertical CSS Menus</a></li>
					<li>
						<a href="#">Image CSS</a></li>
				</ul>
				<h3 class="menuheader expandable" style="color: #006FA1; background-image: url('../../Content/Images/moretitle.png')));">
					Technology Transmitting For Concrete Admixtures </h3>
				<ul class="categoryitems">
					<li>
						<a href="#">Horizontal CSS Menus</a></li>
					<li>
						<a href="#">Vertical CSS Menus</a></li>
					<li>
						<a href="#">Image CSS</a></li>
				</ul>--%>
				<%= ViewData["class"]%>" </div>
		</div>
	</div>
	<div style="width: 300px; text-align: left; margin-left: 268px; position: absolute;
		height: auto; color: red">
		<ul id="productUL" style="list-style: none; line-height: 30px; text-align: left;
			cursor: pointer"></ul>
	</div>
	<div id="descHolder" style="width: 440px; text-align: left; margin-left: 568px; position: absolute">
		<p id="mainMsg">HABITO CONSTRUCTION CHEMICALS have formulated ranges of specialty products
			for the building industry, meet the highest quality standards as well as international
			EN, BS and ASTM norms.<br />
			<br />
			<br />
			The product lines offered by Habito are classified as follows:
			<br />
			<br />
			<br />
			<a href="#">*CONCRETE ADMIXTURES</a><br />
			<br />
			<a href="#">*TECHNOLOGY TRANSMITTING FOR CONCRETE ADMIXTURES</a><br />
			<br />
		</p>
	</div>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="HeadContent" runat="server">
	<style type="text/css">
		.arrowlistmenu { width: 268px; }
		.arrowlistmenu .menuheader { display: block; width: 90%; height: 30px; font: bold 14px Arial; color: white; background: no-repeat center left; margin-bottom: 10px; padding: 4px 0 4px 10px; cursor: hand; cursor: pointer; background-image: url(../../Content/Images/moretitle.png); }
		.arrowlistmenu .openheader { background-image: url('../../Content/Images/moretitle.png'); }
		.arrowlistmenu ul { list-style-type: none; margin: 0; padding: 0; margin-bottom: 8px; }
		.arrowlistmenu ul li { padding-bottom: 2px; }
		.arrowlistmenu ul li a { line-height: 25px; padding-left: 30px; color: #006FA1; background: url('../../Content/images/document.png') no-repeat center left; display: block; text-decoration: none; font-weight: bold; font-size: 90%; }
		.arrowlistmenu ul li a:visited { color: #006FA1; }
		.arrowlistmenu ul li a:hover { color: #A70303; }
	</style>
	<script type="text/javascript">
		var mainMsg = $("#mainMsg").html();
		$(document).ready(function () {
			var classlist = $("[tag=1]");
			$(classlist).each(function (index, content) {
				$(classlist[index]).bind('click', function () {
					$("#productUL").html(''); 
					var classid = $(classlist[index]).attr("classID");
					$.ajax({
						cache: false,
						url: '/Products/GetAllProductByClass',
						data: { classID: classid },
						success: function (data) {
							var html = "";
							$(data).each(function (i, c) {
								html += "<li tt='1' productID='" + c.ID + "'>" + c.ProductName + "</li>"
							});
							$("#productUL").html(html);
							$($("[tt='1']")).each(function (i, x) {
								$($("[tt='1']")[i]).bind("click", function () {
									var productid = $(this).attr("productID");
									$.ajax(
									{
										cache: false,
										url: "/Products/GetProductDesciption",
										data: { productID: productid },
										success: function (data) {
											$("#descHolder").html(data.desc);
										},
										error: function (data) { alert("ERROR"); }
									}
									);
								});
							});
						},
						error: function (data) { alert(data.toString()); }
					});
				});

			});
		});
		ddaccordion.init({
			headerclass: "expandable",
			contentclass: "categoryitems",
			revealtype: "click",
			mouseoverdelay: 250,
			collapseprev: true,
			defaultexpanded: [0],
			onemustopen: false,
			animatedefault: false,
			persiststate: true,
			toggleclass: ["", "openheader"],
			togglehtml: ["prefix", "", ""],
			animatespeed: "slow",
			oninit: function (headers, expandedindices) {

			},
			onopenclose: function (header, index, state, isuseractivated) {

			}
		});
			 
	</script>
</asp:Content>
